// webpack 配置提示
const{Configuration} = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const {VueLoaderPlugin} =require('vue-loader/dist/index')
const {CleanWebpackPlugin} =require('clean-webpack-plugin')
const FriendlyErrorsWebpackPlugin =require("friendly-errors-webpack-plugin")
/**
 * @type {Configuration}
 * */
const config ={
    mode: "development",
    entry: "./src/main.ts",
    devServer: {
        port:8134,// 端口号
        // hot:true,// 热更新
        // open:true,// 自动打开浏览器
     /*   proxy:{ // 接口代理配置
            "/api":{
                target:'http://localhost:3000',
                changeOrigin:true,
            }
        }*/
    },
    module: {
        rules: [
            {
                test: /\.vue$/, //解析vue模板语法 vue-loader
                use: 'vue-loader'
            },
            {
                test: /\.css$/, // 解析css style-loader css-loader
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.less$/, //解析less less less-loader
                use: ['style-loader', 'css-loader','less-loader']
            },
            {
                test: /\.ts$/, //解析ts typescript  ts-loader
                loader: 'ts-loader',
                options: {
                    configFile:path.resolve(process.cwd(),'tsconfig.json'),
                    appendTsSuffixTo: [/\.vue$/]
                },
                exclude: /node_modules/
            },
        ]
    },
    output: {
        filename: "[hash].js", //打包的文件名 hash 作为文件名防止冲突
        path: path.resolve(__dirname, "dist"), //打包输出的位置
    },
    resolve: {
        alias: {
            '@':path.resolve(__dirname, 'src')
        },
        extensions: ['.ts', '.js', '.vue'] // 解析到的文件自动添加后缀
    },
    stats: "errors-only", //美化控制台日志 报错提示 不报错隐藏
    plugins: [
        new HtmlWebpackPlugin({
            template: "./public/index.html"
        }), //将生成的js文件自动导入到指定html
        new VueLoaderPlugin(), //编译vue模板插件
        new CleanWebpackPlugin(), //打包前自动删除dist包插件
        new FriendlyErrorsWebpackPlugin({
            compilationSuccessInfo:{
                messages:[`Your application is running here: http://localhost:8134`]
            }
        }),
    ],
/*    externals: { // CDN引入 打包的时候减小体积 直接在index.html引入 vue
        vue:"Vue",
    }*/
}

module.exports = config;